<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="priv.project.util.ServletUtils" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-security-policy" content="upgrade-insecure-requests"/>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit"/>
<meta name="force-rendering" content="webkit"/>
<title>文旅网</title>

<link type="text/css" rel="stylesheet" href="<%= ServletUtils.getProjectHttpUrl(request)%>/css/web_css/style.css" />
<script type="text/javascript" src="<%= ServletUtils.getProjectHttpUrl(request)%>/js/jquery.min.js"></script>
<script type="text/javascript" src="<%= ServletUtils.getProjectHttpUrl(request)%>/js/web_js/banner.js"></script>
  <style>
    .layui-form-item {
      margin-bottom: 0;
    }

    .layui-form-item .layui-input-inline {
      height: 50px;
      width: 180px;
    }

    .layui-form-select dl {
      max-height: 225px;
    }
    .layui-table-cell .layui-form-checkbox[lay-skin="primary"] {
      top: 5px;
    }
    .parent {
      width: 480px;
      height: 36px;
      /*top: 4px;*/
      position: relative;
      float: right;
    }
    .parent>input:first-of-type {
      /*输入框高度设置为40px, border占据2px，总高度为42px*/
      width: 380px;
      height: 36px;
      border: 1px solid #ccc;
      font-size: 16px;
      outline: none;
    }
    .parent>input:first-of-type:focus {
      border: 1px solid #317ef3;
      padding-left: 10px;
    }
    .parent>input:last-of-type {
      /*button按钮border并不占据外围大小，设置高度42px*/
      width: 100px;
      height: 36px;
      position: absolute;
      background: #317ef3;
      border: 1px solid #317ef3;
      color: #fff;
      font-size: 16px;
      outline: none;
    }
  </style>

</head>

<body>

<!-- 引入公共的头部导航条 -->
<%@include file="header.jsp"%>

<div class="clear"></div>

<!-- 引入公共的轮播图部分 -->
<%@include file="banner.jsp"%>

<div class="clear"></div>
<div class="mabody">
<div class="mainWarp">
  <div class="mainRight" style="margin: 0 auto; float: none; width: 100%">
    <div class="brandnavbox">
       <p class="ccsl">旅游攻略</p>
        <form  id="form" action="<%=ServletUtils.getProjectHttpUrl(request)%>web/system/search" class="layui-form">
          <input type="text" name="keyWord"  autocomplete="off" placeholder="在此搜索攻略..." class="layui-input" style="width: 480px;
      height: 36px;position: relative;float: right;">
<%--          <button lay-submit lay-filter="*" style="height: 36px;float: right;"></button>--%>
        </form>
    </div>
    <ul class="listul">
      <c:forEach items="${pageInfo.records}" var="item">
        <li>
          <div class="newsl">
            <a href="<%= ServletUtils.getProjectHttpUrl(request)%>web/system/toWebStrategyDetailPage?id=${item.id}">
              <img src="${item.indexImg}" />
            </a>
          </div>
          <div class="newsr" style="width: 850px">
            <a href="<%= ServletUtils.getProjectHttpUrl(request)%>web/system/toWebStrategyDetailPage?id=${item.id}" class="ccsl">${item.title}</a>
            <hr>
            <div class="sub" style="min-height: 75px; max-height: 75px;
                 overflow:hidden;  /*内容会被修剪，并且其余内容是不可见的。*/
                 text-overflow: ellipsis;  	/*显示省略符号来代表被修剪的文本*/
                 white-space: nowrap;	/*文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。*/"
            >${item.content}</div>
            <a href="<%= ServletUtils.getProjectHttpUrl(request)%>web/system/toWebStrategyDetailPage?id=${item.id}" class="more">查看详情>> </a>
          </div>
        </li>
      </c:forEach>
    </ul>
    <div class="clear"></div>
    <div class="pagebox">
      <a href="javascript:;" data-pages="${pageCount}" data-current="${pageInfo.current}" id="prev">上一页</a>
      <c:forEach begin="1" end="${pageCount}" var="item">
        <a class="page-numbers pageBtn <c:if test="${pageInfo.current == item}">on</c:if>"
           href="javascript:;" data-current="${pageInfo.current}" data-num="${item}">${item}</a>
      </c:forEach>
      <a href="javascript:;" data-pages="${pageCount}" data-current="${pageInfo.current}" id="next">下一页</a>
    </div>
  </div>
  <div class="clear"></div>
</div>
</div>
<div class="clear"></div>

<!-- 引入公共的底部部分 -->
<%@include file="footer.jsp"%>

</body>
<script src="<%= ServletUtils.getProjectHttpUrl(request)%>/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="<%= ServletUtils.getProjectHttpUrl(request)%>/js/MyLayuiUtils.js"></script>
<script type="text/javascript" src="<%= ServletUtils.getProjectHttpUrl(request)%>/js/me_js/page.js"></script>
<script>
  <%--layui.use('form', function(){--%>
  <%--  var form = layui.form;--%>
  <%--  //各种基于事件的操作，下面会有进一步介绍--%>
  <%--  form.on('submit(*)', function(data){--%>
  <%--    // console.log(data.elem) //被执行事件的元素DOM对象，一般为button对象--%>
  <%--    // console.log(data.form) //被执行提交的form对象，一般在存在form标签时才会返回--%>
  <%--    console.log(data.field.keyWord); //当前容器的全部表单字段，名值对形式：{name: value}--%>
  <%--    var param={--%>
  <%--      keyWord:''--%>
  <%--    };--%>
  <%--    param.keyWord=data.field.keyWord;--%>
  <%--    sendAjax(--%>
  <%--            "<%= ServletUtils.getProjectHttpUrl(request)%>web/system/search",--%>
  <%--            "GET",--%>
  <%--            param,--%>
  <%--            function success(res) {--%>
  <%--              console.log(res);--%>
  <%--    });--%>
  <%--    return false--%>
  <%--  });--%>
  <%--});--%>
</script>

</html>
